/*ANIMATIONS 
Section  Slider  - text animations 
// ///////////////////////////////////////////////////////////////////


/* h5 in current slide animating */
.current_slide h5 span{
    opacity: 0;
    animation-name: fadeInFromLeft;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}

.current_slide h5 .span-h5-1 {    animation-delay: 0s;}
.current_slide h5 .span-h5-2 {    animation-delay: 0.05s;}
.current_slide h5 .span-h5-3 {    animation-delay: 0.1s;}
.current_slide h5 .span-h5-4 {    animation-delay: 0.15s;}
.current_slide h5 .span-h5-5 {    animation-delay: 0.2s;}
.current_slide h5 .span-h5-6 {    animation-delay: 0.25s;}
.current_slide h5 .span-h5-7 {    animation-delay: 0.3s;}
.current_slide h5 .span-h5-8 {    animation-delay: 0.35s;}
.current_slide h5 .span-h5-9 {    animation-delay: 0.4s;}
.current_slide h5 .span-h5-10 {    animation-delay: 0.45s;}
.current_slide h5 .span-h5-11 {    animation-delay: 0.5s;}
.current_slide h5 .span-h5-12 {    animation-delay: 0.55s;}
.current_slide h5 .span-h5-13 {    animation-delay: 0.6s;}
.current_slide h5 .span-h5-14 {    animation-delay: 0.65s;}
.current_slide h5 .span-h5-15 {    animation-delay: 0.7s;}
.current_slide h5 .span-h5-16 {    animation-delay: 0.75s;}
.current_slide h5 .span-h5-17 {    animation-delay: 0.8s;}
.current_slide h5 .span-h5-18 {    animation-delay: 0.85s;}
.current_slide h5 .span-h5-19 {    animation-delay: 0.9s;}
.current_slide h5 .span-h5-20 {    animation-delay:0.95s;}


/* span  in div in slider animating */

.current_slide div>span {
    opacity: 0;
    animation-name: fadeInFromRight;
    animation-duration: 1s;
    animation-fill-mode: forwards;
}
.current_slide div>.span-1 {    animation-delay: 0.5s;}
.current_slide div>.span-2 {    animation-delay: 0.55s;}
.current_slide div>.span-3 {    animation-delay: 0.6s;}
.current_slide div>.span-4 {    animation-delay: 0.65s;}
.current_slide div>.span-5 {    animation-delay: 0.7s;}
.current_slide div>.span-6 {    animation-delay: 0.75s;}
.current_slide div>.span-7 {    animation-delay: 0.8s;}
.current_slide div>.span-8 {    animation-delay: 0.85s;}
.current_slide div>.span-9 {    animation-delay: 0.9s;}
.current_slide div>.span-10 {    animation-delay: 0.95s;}
.current_slide div>.span-11 {    animation-delay: 1s;}
.current_slide div>.span-12 {    animation-delay: 1.05s;}
.current_slide div>.span-13 {    animation-delay: 1.1s;}
.current_slide div>.span-14 {    animation-delay: 1.15s;}
.current_slide div>.span-15 {    animation-delay: 1.2s;}
.current_slide div>.span-16 {    animation-delay: 1.25s;}
.current_slide div>.span-17 {    animation-delay: 1.3s;}
.current_slide div>.span-18 {    animation-delay: 1.35s;}
.current_slide div>.span-19 {    animation-delay: 1.4s;}
.current_slide div>.span-20 {    animation-delay: 1.45s;}
.current_slide div>.span-21 {    animation-delay: 1.5s;}
.current_slide div>.span-22 {    animation-delay: 1.55s;}
.current_slide div>.span-23 {    animation-delay: 1.6s;}
.current_slide div>.span-24 {    animation-delay: 1.65s;}
.current_slide div>.span-25 {    animation-delay: 1.7s;}
.current_slide div>.span-26 {    animation-delay: 1.75s;}
.current_slide div>.span-27 {    animation-delay: 1.8s;}
.current_slide div>.span-28 {    animation-delay: 1.85s;}
.current_slide div>.span-29 {    animation-delay: 1.9s;}
.current_slide div>.span-30 {    animation-delay: 1.95s;}
.current_slide div>.span-31 {    animation-delay: 2s;}
.current_slide div>.span-32 {    animation-delay: 2.05s;}



/* animate paragraph in current slide */

.current_slide p {
    opacity: 0;
    animation-name: fadingIn;
    animation-duration: 2s;
    animation-delay: 2s;
    animation-fill-mode: forwards;
}



/* animate btn crslread */

.current_slide .btncrslRead , .current_slide .btncrslvw {
    opacity: 0;
    animation-name: comeFromDown;
    animation-duration: 1s;
    animation-delay: 2.5s;
    animation-fill-mode: forwards;
}


/* animate btn crslreg */

.current_slide .btncrslReg {
    opacity: 0;
    animation-name: comeFromDown;
    animation-duration: 1s;
    animation-delay: 3s;
    animation-fill-mode: forwards;
}


.now .btncrslRead{
    opacity: 0;
    animation-name: comeFromDown;
    animation-duration: 1s;
    animation-delay: 2.5s;
    animation-fill-mode: forwards;
}

.now .btncrslReg {
    opacity: 0;
    animation-name: comeFromDown;
    animation-duration: 1s;
    animation-delay: 3s;
    animation-fill-mode: forwards;
}

.current_slide {
    opacity: 0;
    animation-name: fadeInn;
    animation-duration: 3s;
    animation-fill-mode: forwards;
    animation-timing-function: ease-in;
}


@keyframes fadeInn {
    from {
        background-size: 100% 100%;
        opacity: 0.9;
    }
    to {
        opacity: 1;
        background-size: 110% 110%;
        /* transform: scaleX(1.1); */
    }
}

@keyframes anim_fadeInLeft {
    0% {
        opacity: 0;
        transform: rotateY(-180deg);
    }
    25% {
        opacity: 1;
        transform: rotateY(-120deg);
    }
    50% {
        opacity: 1;
        transform: rotateY(-60deg);
    }
    100% {
        opacity: 1;
        transform: rotateY(0deg);
    }
}


.anim_fadeInLeft_cls {
    animation-name: anim_fadeInLeft;
    animation-duration: 1s;
    animation-fill-mode: forwards;
    /* animation-delay: 1s; */
}

@keyframes shown {
    from {
        transform: translateX(-2%);
        opacity: 0;
    }
    to {
        transform: translateX(0%);
        opacity: 1;
    }
}

@keyframes skew {
    from {
        transform: skew(20deg);
        opacity: 0;
    }
    to {
        transform: skew(0deg);
        opacity: 1;
    }
}

@keyframes zoom {
    from {
        transform: scale(0.9);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes fadingIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}


/*THE END ANIMATIONS 
Section  Slider  - text animations 
////////////////////////////////////////////////////////////////////